<style lang="less" scoped>
    .ivu-card-head-inner, .ivu-card-head p{
        height: auto;
        overflow: inherit;
       
    }
    .page-margin-top{
        margin-top:10px;
    }
    .vertical-center-modal{
        display: flex;
        align-items: center;
        justify-content: center;

        .ivu-modal{
            top: 0;
        }
    }
</style>

<template>
    <div class="lm">
        <Row class="margin-top-10">
            <Card>
                <p slot="title" class="card-title">
                    <Row class="" :gutter="10">
                        <Col :md="4" :lg="2">
                            <div style="margin-top: 2px;">
                                <Icon type="ios-pulse"></Icon>
                                {{this.$route.meta.title}}
                            </div>
                        </Col>
                        <Col :md="20" :lg="22">
                            <Form :model="formItem" label-position="left" inline>
                                彩种：
                                <Select v-model="formItem.thissysLts" @on-change="czchange" size="small" style="width:120px">
                                    <Option v-for="(key,index) in sysLts" v-if="key.gid" :value="key.gid" :key="key.id">{{key.lt_name}}</Option>                                        
                                </Select>
                            </Form>
                        </Col>
                    </Row>
                </p>
                <div class="line-chart-con">
                    <Table border stripe :columns="title" :data.sync="data" ></Table>
                </div>
            </Card>
        </Row>
        <Modal
            title="修改预设"
            v-model="modal"
            @on-ok="bcModal"
            class-name="vertical-center-modal">
            <Form :model="formBatch" label-position="left" :label-width="100">
                <FormItem label="期号：">
                    <Input :number="true" disabled v-model="formBatch.issue"></Input>
                </FormItem>
                <FormItem label="开奖号：">
                    <Input v-for="(key,index) in formBatch.open_number" :key="index" v-model="formBatch.open_number[index]" style="margin-right: 2px; width: 60px;"></Input>
                </FormItem>
                <FormItem label="开奖日期：">
                    <DatePicker type="date" disabled v-model="formBatch.open_date"  placeholder="Select date" style="width: 200px"></DatePicker>
                </FormItem>
                <FormItem label="开奖时间：">
                    <TimePicker type="time" disabled v-model="formBatch.open_time" placeholder="Select time" style="width: 200px"></TimePicker>
                </FormItem>
            </Form>
        </Modal>
    </div>
</template>

<script>

export default {
    
    components: {
        
    },
    data () {
        return {
            formBatch:{
                index:0,
                id: 0,
                gid: 0,
                issue: "",
                open_number: [0,1,2,3],
                open_time: "06:30:00",
                open_date: "2018-05-30",
                open_timestamp: 0,
                LtName: ""
            },
            modal: false,
            lottery:{},
            sysLts:[],
            lotteriesList:[],
            formItem:{
                thissysLts:''
            },
            sfkj:[],
            data:[],
            title:[
                {
                    title:'期号',
                    key: 'issue',
                    align:'center',
                },
                {
                    title:'开奖号',
                    key: 'open_number',
                    align:'center',
                },
                {
                    title:'开奖时间',
                    key: 'open_time',
                    align:'center',
                },
                {
                    title:'距离开奖倒计时',
                    key: 'open_timestamp',
                    align:'center',
                    render: (h, params) => {
                        let _this=this
                        return h('div',[
                            h('oc-Countdown', {
                                props: {
                                    startTime: params.row.open_timestamp,
                                    endTime: params.row.open_timestamp,
                                    endText:'已开奖',
                                    dayTxt:'天',
                                    hourTxt:'小时',
                                    minutesTxt:'分钟',
                                    secondsTxt:'秒',
                                },
                                style:{
                                    
                                },
                                on:{
                                    end_callback(){
                                        _this.$set(_this.sfkj,params.index,true)
                                        if(_this.modal==true&&params.row.id==_this.formBatch.id){
                                            _this.modal=false
                                            _this.$Notice.warning({
                                                title: '操作被截止',
                                                desc: `原因：${params.row.LtName}${params.row.issue}期，已开奖。`
                                            });
                                        }
                                        // this.countDownE_cb(1)
                                    }
                                }
                            })
                        ])
                    }
                },
                {
                    title:'操作',
                    key: '',
                    align:'center',
                    // width:'100'
                    render: (h, params) => {
                        let _this=this
                        return h('div',[
                            h('Button', {
                                props: {
                                    size: 'small',
                                    type:'primary',
                                    disabled: this.sfkj[params.index]==false?false:true
                                },
                                style:{
                                    
                                },
                                on:{
                                    click(){
                                        _this.czthiscz(params)
                                    }
                                }
                            },'修改')
                        ])
                    }
                }
            ]
                
            
        }
    },
    computed: {
        
    },
    methods: {
        czthiscz(p){
            this.modal=true
            let n=p.row.open_number.split(",")
            let d=p.row.open_time.split(" ")
            this.formBatch={
                index:p.index,
                id: p.row.id,
                gid: p.row.gid,
                issue: p.row.issue,
                open_number: n,
                open_time: d[1],
                open_date: d[0],
                open_timestamp: p.row.open_timestamp,
                LtName: p.row.LtName
            }
        },

        czchange(v){
            let data={
                gid:v
            }
            this.sfkj=[]
            this.$api.repeater(this,'getTmpData',data).then(res=>{
                if(res.success==true){
                    this.data=res.data
                    for(let i=0;i<res.data.length;i++){
                        this.sfkj.push(false)
                    }
                }
            })
        },
        bcModal(){
            function gshdate(d){
                var date = new Date(d);  
                return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate()
            }
            let data={
                query:{
                    gid:this.formBatch.gid
                },
                data:{
                    id: this.formBatch.id,
                    gid:this.formBatch.gid,
                    issue: this.formBatch.issue,
                    open_number: `${this.formBatch.open_number.join(",")}`,
                    open_time: `${gshdate(this.formBatch.open_date)} ${this.formBatch.open_time}`,
                    LtName: this.formBatch.LtName
                }
            }
            this.$api.repeater(this,'setTmpData',data).then(res=>{
                if(res.success==true){
                    this.data[this.formBatch.index].open_number=res.data.open_number
                    this.$Notice.success({
                        title: '修改成功'
                    });
                }
                if(res==false){
                    this.$Notice.error({
                        title: '修改失败'
                    });
                }
            })
            // this.$api.setTmpData(data).then(response=>{
            //     response.json().then(responseJson=> {
            //         if(responseJson.success==true){
            //             this.data[this.formBatch.index].open_number=responseJson.data.open_number
            //             this.$Notice.success({
            //                 title: '修改成功'
            //             });
            //         }else{
            //             this.$Notice.error({
            //                 title: '修改失败'
            //             });
            //         }
                    
                    
            //     })
            // })
        },
        getGameLotteries () {
            this.$api.repeater(this,'getGameLotteries').then(res=>{
                for(let i=0;i<res.lotteries.length;i++){
                    if(res.lotteries[i].system_lt){
                        for(let j=0;j<res.sysLts.length;j++){
                            if(res.lotteries[i].gid==res.sysLts[j].gid&&res.sysLts[j].is_profit==false){
                                this.sysLts.push(res.sysLts[j])
                            }
                        }
                            
                    }else{
                            // this.lotteriesList.push(res.lotteries[i])
                    }
                }
                this.formItem.thissysLts=this.sysLts[0].gid
                    // this.czchange(this.sysLts[0].gid)
                    // this.sysLts=responseJson.sysLts
            })
        }
    },
    created(){
        this.getGameLotteries()
        // this.lottery=JSON.parse(sessionStorage.lottery)
    },
};
</script>
